<template>
    <!--中间信息块，在手机端不可见，每个div为超链接-->
    <div class="ce_info hidden-xs">
        <div class="container">
            <div class="row">
                <!--响应式向上传：不用设置lg，使用bootstrap组件-媒体对象
                width:768-992 小屏幕 平板  sm  2等分
                width:992-1200 中等屏幕 桌面显示器 md 3等分-->
                <div class="col-sm-6 col-md-4" v-for="(item,index) in coreDescDtos" :key="index">
                    <a href="javascript:;">
                        <div class="media">
                            <img class="media-icon" :src="item.icon">

                            <div class="media-body">
                                <h4 :model="item.title" class="media-heading">{{item.title}}</h4>
                                <p :model="item.desc">{{item.desc}}</p>
                            </div>
                        </div>
                    </a>
                </div>

            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "MainInfo",
        data(){
            return{
                message:"主页信息块",
                coreDescDtos:[],
            }
        },
        mounted() {
            this.getBaseModule();
        },
        methods:{
            //获取baseModule数据
            getBaseModule(){
                let loading=this.openLoading();
                this.$axios.get(process.env.VUE_APP_SERVER+'/business/client/module/getBaseModule').then((response)=>{
                    //Loadings.hide();
                    setTimeout(function () {
                        loading.close();
                    },300);
                    this.fullscreenLoading=true;
                    let resp=response.data;
                    this.fullscreenLoading=false;
                    if(resp.success){
                        for(let i=0;i<resp.responseData.length;i++){
                            if(resp.responseData[i].name.indexOf("轮播图")!==-1){
                                this.coreDescDtos=resp.responseData[i].coreDescDtos;
                            }
                        }
                    }
                });
            },
        }
    }
</script>

<style scoped>
    /*信息块样式*/
    .ce_info{
        padding: 20px;
    }

    .ce_info .ce_icon{
        font-size: 30px;
    }
    .row div{
        margin-top: 10px;
    }
    .row div a{
        color: #777;
    }
    .row div a:hover{
        text-decoration: none;
        color: #e92322;
        border-bottom: unset;
    }
    .row img{
        float: left;
        margin-right: 8px;
        margin-top: 2px;
        width: 36px;
        height: 36px;
    }
</style>